<template>
    <cfg-form-list slot="right">
        <cfg-title-prefix v-bind="config.title" :onlyRead="onlyRead" :data="data"></cfg-title-prefix>
        <cfg-form :only-read="onlyRead" v-bind="config.section.start" :data="data"></cfg-form>
        <cfg-subtitle :title="'记录:'"></cfg-subtitle>
        <cfg-sheet :onlyRead="onlyRead" v-bind="config.section.records" :data="data.records"></cfg-sheet>
        <Button type="primary" long @click="data.records.push({})">加一行</Button>
        <cfg-subtitle :title="'备注:'"></cfg-subtitle>
        <cfg-form :onlyRead="onlyRead" v-bind="config.section.comments" :data="data"></cfg-form>
        <cfg-form :only-read="onlyRead" style="margin-top:10px;" v-bind="config.section.end" :data="data"></cfg-form>
    </cfg-form-list>
</template>

<script>
    export default {
        data () {
            return {
                onlyRead: false,
                config: {
                    title: {
                        title: '粉 合 批 通 知 书',
                        titleStyle: {},
                        outlineStyle: { marginBottom: '20px' },
                        config: { type: 'text' }
                    },
                    section: {
                        start: {
                            labelWidth: 70,
                            labelPosition: 'right',
                            cols: 3,
                            columns: [
                                { title: '流水号:', key: 'No', config: { type: 'text' } }
                            ],
                            rules: {}
                        },
                        records: {
                            columns: [
                                { title: '日期', align: 'center', key: 'date', config: { type: 'date' } },
                                { title: '批次（待合物料）', align: 'center', key: 'batch', config: { type: 'text' } },
                                { title: '重量 <br/>（kg)', align: 'center', key: 'weight', config: { type: 'number' } },
                                { title: 'FSSS<br/>(um)', align: 'center', key: 'fsss', config: { type: 'number' } },
                                { title: '氧<br/>(%)', align: 'center', key: 'oxygen', config: { type: 'number' } },
                                { title: 'HB松装密度<br/>(g/cm³)', align: 'center', key: 'hb', config: { type: 'number' } },
                                { title: 'TAP<br/>(振实密度)', align: 'center', key: 'tap', config: { type: 'number' } },
                                { title: 'Fe', align: 'center', key: 'fe', config: { type: 'text' } }
                            ]
                        },
                        comments: {
                            labelWidth: 0,
                            labelPosition: 'right',
                            cols: 1,
                            columns: [
                                { title: '', key: 'name', config: { type: 'textarea' } }
                            ],
                            rules: {}
                        },
                        end: {
                            labelWidth: 70,
                            labelPosition: 'right',
                            columns: [
                                { title: '通知者:', key: 'notifier', config: { type: 'text' } }
                            ],
                            cols: 3,
                            rules: {}
                        }
                    }
                }
            };
        },
        props: {
            data: {
                default: () => {
                    return {
                        titlePrefix: '',
                        No: '()年xx号',
                        records: [
                            {
                                date: '',
                                batch: '',
                                weight: 0,
                                fsss: 0,
                                oxygen: 0,
                                hb: 0,
                                tap: 0,
                                fe: ''
                            }
                        ],
                        comments: '',
                        notifier: ''
                    }
                }
            }
        }
    };
</script>
<style scoped lang="scss"></style>
